<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    
    <title></title>
    <style type="text/css">
    	.sz-header{
    		display: flex;
    		width: 17rem;
    		padding:0 0.5rem;
    		height: 2.2rem;
    		background: white;
    		justify-content: space-between;
    		align-items: center;
    		
    	}
    	.sz-header span{
    		font-size: 0.9rem;
    	}
    	
    	.sz-header i{
    		font-size: 1.2rem;
    		
    	}
    	.sz-header i:nth-of-type(2){
    		color: #f34a50;
    	}
    	.sz-kong{
    		background: #EEEEEE;
    		width: 100%;
    		height: 0.09rem;
    		border-bottom: 1px solid #CCCCCC;
    	}
    	.sz-list1{
    		width: 100%;
    	}
    	.list-yi{
    		display: flex;
    		width: 96%;
    		margin: 0 auto;
    		padding: 0.8rem 0;
    		font-size: 0.8rem;
    		height: 1rem;
    		text-align: center;
    		align-items: center;
    		line-height: 1rem;
    	}
    	.list-yi span{
    		color:lightgray;
    		margin-right: 0.4rem;
    	}
    	.sz-line{
    		width: 93%;
    		
    		position: relative;
    		right: -1.2rem;
    		top: 0;
    		height: 0.05rem;
    		background: #BEBEBE;
    	}
    	
    	.sz-p1{
    		position: relative;
    		left: 12rem;
    		background: #F24046;
    		border-radius: 50%;
    		width: 0.6rem;
    		height: 0.6rem;
    	}
    	.sz-kong1{
    		background: #EEEEEE;
    		width: 100%;
    		height: 1rem;
    		border-top: 1px solid #CCCCCC;
    	}
    	.sz-but{
    		width: 100%;
    		display: flex;
    		text-align: center;
    		background: #EEEEEE;
    		height:100%;
    		
    	}
    .sz-but	button{
    		width: 96%;
    		height: 2rem;
    		color: #F24046;
    		text-align: center;
    		margin: 0 auto;
    		border: none;
    		background: white;
    		border: 1px solid #E7E1CD;
    		border-radius: 0.2rem;
    		outline: none;
    		font-size: 0.75rem;
    	}
    	
    	.fen{
    		width: 18rem;
    		height: 13rem;
    		background: #fff;
    		position: fixed;
    		bottom: 0;
    		z-index: 100;
    	}
    	.fen ul{
    		width: 18rem;
    		height: 9rem;
    		padding-top: 1.7rem;
    		display: flex;
    		justify-content: space-between;
    		flex-wrap: wrap;
    		
    	}
    	.fen ul li{
    		width: 33.3%;
    		text-align: center;
    	}
    	.fen ul li img{
    		width: 2.25rem;
    	}
    	.fen ul li p{
    		color: #666;
    		font-size: 0.75rem;
    	}
    	.fen .btn{
    		width: 18rem;
    		font-size: 0.75rem;
    		color: #999;
    		border:none;
    		outline: none;
    		background: none;
    	}
    	.alertBox{
				width: 18rem;
				height: 30rem;
				background: rgba(0,0,0,0.5);
				position: fixed;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				z-index: 10;
			}
    </style>
</head>
<body>
	<div class="sz-header">
		<i class="fa fa-fw fa-angle-left" onClick="javascript :history.back(-1)"></i>
		<span>设置</span>
		<i class="fa fa-fw fa-check"></i>
	</div>
	<!---->
	<div class="sz-kong"></div>
	<!---->
	<div class="sz-list1 " > 
		<div class="list-yi" ng-click="alert()">
			<span class="fa fa-fw fa-share-alt"></span>
		<p>分享给好友</p>
		</div>
	</div>
	<!---->
	<div class="sz-line"></div>
	<!---->
	 <div class="sz-list1">
		
		<div class="list-yi">
			<span class="fa fa-fw fa-file-o"></span>
		<p>意见反馈</p>
		</div>
	</div>
	<!---->
	<div class="sz-line"></div>
	<!---->
	<div class="sz-list1">
		
		<div class="list-yi">
			<span class="fa fa-fw fa-refresh"></span>
		    <p>检查更新</p>
		    <p class="sz-p1"></p>
		</div>
	</div>
	<!---->
	<div class="sz-kong1"></div>
	<!---->
	<div class="sz-list1">
		<div class="list-yi">
			<span class="fa fa-fw fa-trash-o"></span>
		    <p>清理缓存</p>
		</div>
	</div>
<!---->
	<div class="sz-kong1"></div>
	<!---->
	<div class="sz-but"><button>退出登录</button></div>
	
	<div class="alertBox" ng-show="showa">
	
	</div>
		<div class="fen" ng-show="showa">
		<ul>
			<li>
				<img src="img/q1.png" alt="" />
				<p>朋友圈</p>
			</li>
			<li>
				<img src="img/q2.png" alt="" />
				<p>微信好友</p>
			</li>
			<li>
				<img src="img/q3.png" alt="" />
				<p>QQ好友</p>
			</li>
			<li>
				<img src="img/q4.png" alt="" />
				<p>QQ空间</p>
			</li>
			<li>
				<img src="img/q5.png" alt="" />
				<p>新浪微博</p>
			</li>
			<li>
				<img src="img/q6.png" alt="" />
				<p>复制链接</p>
			</li>
		</ul>
	    <button class="btn" ng-click="cancel()">取消</button>
		</div>
</body>
</html>